<template>
  <div>
    <h3>会员等级列表</h3>
    <input type="button" value="增加" class="btn btn-primary" @click="add" />
    <table class="table table-bordered">
      <tbody>
        <tr class="bg-primary">
          <td>Id</td>
          <td>等级名称</td>
        </tr>
        <tr v-for="item in memberLevelList" :key="item.Id">
          <td>{{ item.Id }}</td>
          <td>{{ item.LevelName }}</td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script setup lang="ts">
import { useRouter } from 'vue-router';
import { ref, reactive, onMounted } from 'vue';
import axios from 'axios';

const router = useRouter();

//接受后端返回的会员等级列表数据
let memberLevelList: any = ref([]);

//跳转到会员等级增加页面
const add = () => {
  router.push('/memberLevelAdd');
};

onMounted(() => {
  getMemnerList();
});
//获取会员等级列表
const getMemnerList = () => {
  axios({
    url: '/api/Members/MemberLevelsList',
    method: 'get',
  })
    .then((res) => {
      console.log(res);
      //需要存储
      memberLevelList.value = res.data;
    })
    .catch((err) => {
      console.log(err);
    });
};
</script>

<style scoped></style>
